/**
 * value部分的key展示
 */
Vue.component("data-key", {
    template :
        `
        <Alert show-icon type="" style="margin-bottom:0px;padding: 5px 16px 5px 69px;">
            Key
            <Icon type="key" slot="icon"></Icon>
            <template slot="desc">
                <Tooltip content="点击复制key..." placement="top-start">
                    <a v-bind:id="'clip' + data.count" :data-clipboard-text="data.key">{{data.key}}</a>
                </Tooltip>
            </template>
            <Poptip placement="left-start" confirm width="200" title="您确认删除这条内容吗？" @on-ok="deleteKey" style="position: absolute;right: 5%;">
                <Icon type="ios-trash-outline" size="30" style="cursor: pointer;"></Icon>
            </Poptip>
        </Alert>
        `,
    props : ["data"],
    methods : {
        deleteKey: function () {
            this.$emit("deleteKey");
        }
    },
    updated : function () {
        var that = this, clipboard = new Clipboard("#clip" + that.data.count);
        clipboard.on("success", function(e) {
            that.$Message.success("key复制成功...");
        });
        clipboard.on("error", function(e) {
            that.$Message.error("key复制失败...");
        });
    }
});